body {
    width: 500px;
    margin: auto;
}

.calculator {
    width: 454px;
    border: 1px solid #ccc;
    padding: 10px;
    box-sizing: border-box;
}

.calculator input {
    width: 100%;
    height: 100px;
    text-align: right;
    border: none;
    padding: 10px;
    box-sizing: border-box;
    font-size: 30px;
}

.buttons button {
    width: 100px;
    height: 100px;
    border: 1px solid #ccc;
    margin: 2px;
    font-size: 18px;
}

button:hover {
    background-color: aqua;
    transition: 1s all;
}

button:hover::after {
    background-color: #ccc;
}

.operator,
.equal {
    background-color: #eee;
}